<template name="home">
	<view>
		<scroll-view>
			<!-- 轮播 -->
			<swiper class="screen-swiper square-dot"  :indicator-dots="true" :circular="true"
			 :autoplay="true" interval="5000" duration="500" :style="[{animation: 'show 0.2s 1'}]">
				<swiper-item v-for="(item,index) in swiperList" :key="index">
					<image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
					<video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false" objectFit="cover" v-if="item.type=='video'"></video>
				</swiper-item>
			</swiper>
			<!-- #ifdef APP-PLUS -->
			<view class="ad-view">
			  <ad adpid="1793677720" @load="onload" @close="onclose" @error="onerror"></ad>
			</view>
			<!-- #endif -->
			<!-- 常用服务 -->
			<view class="cu-bar bg-white solid-bottom" :style="[{animation: 'show 0.5s 1'}]">
				<view class="action">
					<text class='cuIcon-title text-blue'></text>常用服务
				</view>
			</view>
				
			<view class="cu-list grid col-4 text-sm">
				<view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.05 + 's'}]" v-for="(item,index) in usList" :key="index" @tap="goPage(item.page)">
					<view class="padding text-center">
						<image :src="item.icon" style="width:28px;height:28px;">
							<view class="cu-tag badge margin-top-sm" style="margin-left:1.2em" v-if="getTtemDotInfo(item)">
							   <block v-if="getTtemDotInfo(item)">{{getTtemDotInfo(item)}}</block>
							</view>
						</image>
						<view class="margin-top-xs">{{item.title}}</view>
					</view>
				</view>
			</view>
				
			<!-- 其他服务 -->
			<view v-if="osList.length>0" class="cu-bar bg-white solid-bottom margin-top"  :style="[{animation: 'show 0.6s 1'}]">
				<view class="action">
					 <text class='cuIcon-title text-yellow'></text>其他服务
				</view>
			</view>
			<view class="cu-list grid col-4 text-sm">
				<view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]" v-for="(item,index) in osList" :key="index" @tap="goPage(item.page)">
					<view class="padding text-center">
						<image :src="item.icon" style="width:28px;height:28px;"/>
						<view class="margin-top-xs">{{item.title}}</view>
					</view>
				</view>
			</view>
		</scroll-view>
		<view class="cu-tabbar-height margin-top"></view>
	</view>
</template>

<script>
	import configService from '@/common/service/config.service.js'
	import { us,os } from '@/common/util/work.js'
	import socket from '@/common/js-sdk/socket/socket.js'
	// 语音播放器实例
	let mp3 = uni.createInnerAudioContext();
	export default {
		name: 'home',
		props:{
			cur:String,
		},
		watch: {
			cur: {
				immediate: true,
				handler:function(val,oldVal){
					console.log('cur',val,oldVal)
				    this.initMenu()
				},
			},
		},
		data() {
			return {
			 swiperList: [],
				middleApps: [
				  {icon: 'line2_icon1.png', title: '审批', 'text': '个人审批'},
				  {icon: 'line2_icon2.png', title: '审批稿', 'text': '审批草稿箱'},
				],
				usList:[],
				osList:os.data,
				msgCount:0,
				dot:{
				  mailHome:false
				},
				text:'',
				status: 'none',
				url: ''
			}
		},
		methods: {
			playVoice(){
				mp3.src = this.url;
				console.log("mp3.src=======",mp3.src)
				mp3.play();
			},
			requestAPI(){
				if(!this.text || this.text.length < 1){
					uni.showToast({
						title:'请输入内容',
						icon:'none'
					})
					return;
				}
				
				let that = this;
				that.status = 'loading';
				
				uni.request({
					method:'POST',
					url:'https://5555api.com/data/api',
					data:{
						apikey: 'test_app_key_5555api.com',
						action:'queryVoiceByText',
						text: that.text,
					},
					success(res) {
						that.status = 'no';
						console.error('请求成功：', res);
						that.url = res.data.data.data;
					},
					fail() {
						that.status = 'no';
					}
				});
			},
			initMenu(){
				// this.speak();
				console.log("-----------home------------")
			    this.onSocketOpen()
			    this.onSocketReceive()
			    this.loadCount(0);
				let that = this;
				this.$http.get("/oa/oaSysSwiper/list",{params:{pageNo: 1, pageSize:10,column:'sort',order:'asc',status:'Y'}}).then(res=>{
				  if(res.data.success){
					  for(let annItem of res.data.result.records){
						  annItem.url=configService.staticDomainURL+'/'+annItem.url
					  	this.swiperList.push(annItem)							
					  }
				  }else{
					this.$tip.toast(res.data.message);
				  }
				});
				this.$http.get("/oa/oaSysAppRoute/list",{params:{pageNo: 1, pageSize:10,column:'sort',order:'asc',status:'Y'}}).then(res=>{
				  if(res.data.success){
					  for(let annItem of res.data.result.records){
						  annItem.icon=configService.staticDomainURL+'/'+annItem.icon
					  	this.usList.push(annItem)							
					  }
				  }else{
					this.$tip.toast(res.data.message);
				  }
				});
			},
			goPage(page){
				if(!page){
					return false;
				}
				if(page==='annotationList'){
				  this.msgCount = 0
				}
				this.dot[page]=false
				this.$Router.push({name: page})
			},
			// 启动webSocket
			onSocketOpen() {
				// this.speak();   
				socket.init('websocket');
			},
			onSocketReceive() {
				var _this=this
				socket.acceptMessage = function(res){
					// console.log("页面收到的消息333333333333333333333333333333333333333", res);
					// _this.text=res.msgTxt;
					// _this.requestAPI();
					_this.url="https://imp.fagui.cc/static/ttsmaker-file-2024-6-29-0-17-2.mp3";
					if(res.cmd == "topic"){
						setTimeout(() => {
						      // 5秒后执行的代码
						      // console.log('5秒已过，执行操作。');
							  _this.playVoice();
						    }, 5000);
					  //系统通知
					  _this.loadCount('1')
					}else if(res.cmd == "user"){
					  //用户消息
					  setTimeout(() => {
					        // 5秒后执行的代码
					        // console.log('5秒已过，执行操作。');
					  	  _this.playVoice();
					      }, 5000);
					  _this.loadCount('2')
					} else if(res.cmd == 'email'){
					 //邮件消息
					 setTimeout(() => {
					       // 5秒后执行的代码
					       // console.log('5秒已过，执行操作。');
					 	  _this.playVoice();
					     }, 5000);
					  _this.loadEmailCount()
					}
				}
			},
			loadCount(flag){
				// this.speak();
				console.log("loadCount::flag",flag)
				let url = '/sys/annountCement/listByUser';
				this.$http.get(url).then(res=>{
					console.log("res::",res)
				  if(res.data.success){
					let msg1Count = res.data.result.anntMsgTotal;
					let msg2Count = res.data.result.sysMsgTotal;
					this.msgCount = msg1Count + msg2Count
					console.log("this.msgCount",this.msgCount)
				  }
				})
			},
			loadEmailCount(){
				this.dot.mailHome = true
			},
			getTtemDotInfo(item){
				if(item.page==='annotationList' && this.msgCount>0){
				  return this.msgCount
				}
				return '';
			}
		}
	}
</script>

<style scoped>
	.cu-list.grid>.cu-item {
	  padding: 0px 0px; 
	}
    .line2-icon {
	  width: 60px;
	  height: 60px;
    }
	.ad-view {
	    background-color: #FFFFFF;
	    margin-bottom: 10px;
	  }
</style>
